<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>付款页面</title>
  <link rel="stylesheet" type="text/css" th:href="@{/pc/css/pay/pay.css}"/>
  <script th:src="@{/pc/js/jquery-1.8.0.min.js}"></script>
  <script type="text/javascript">

    $(function () {
      $(".submit_order").click(function () {
        $("#pay_form").submit();
      });
      $("input").click(function () {
        var val=$('input:radio[name="frpId"]:checked').val();
        console.log(val);
//      var frpval = $("input[name='frpId']").val();
        if(val == 'SJ_HDFK'){
          $(".payment-cod").css({
              "border" : "1px",
              "border-style" : "solid",
              "border-color" : "#ff3b3c"
          });
        }else {
          $(".payment-cod").css({
              "border" : "1px",
              "border-style" : "solid",
              "border-color" : "#ddd"
          });
        }
      });
    });
  </script>
  <style type="text/css">
    .ph-on {
      color: #ffffff;
      /*text-align: center;*/
      padding: 10px 10px 20px 3px;
      background: url("/pc/images/payment/kuang-red.png") no-repeat;
      font-size: 12px;
    }

    label {
      /*padding:0px 30px; !*设置内边距：上下10px，左右30px*!*/
      /*border:1px solid green; !*为了便于观察，显示出边框*!*/
    }
    .other_pay{
      outline: none;
      padding-left: 16px;
      list-style: none;
    }
    .other_pay:after{
      display: block;
      content: '';
      clear: both;
    }
    .other_pay li{
      float: left;
      margin-right: 10px;
      /*border-right: #B2B2B2 dashed 3px;*/
      padding-right: 10px;
    }
    .payment-cod{
      float: left;
      border: 1px solid #ddd;
      padding: 3px 44px;
    }
  </style>
</head>

<body>
<div id="test" style="width: 1000px;margin: 0 auto;background-color: #ffffff">
  <div th:include="payment/introduce/page :: header"></div>
  <div class="container">
    <div style="margin-top: 10px">
      <div class="ph-on"><span style="margin-left: 4px" th:text="'支付编号: ' + ${payNum}">--</span></div>
    </div>
    <div style="border:3px solid #ffe9e9;margin-bottom: 15px;" th:if="''">
      <form action="/api/pay/surePay" id="pay_form" method="post" style="margin: 15px">
        <input type="hidden" name="payNumber" th:value="${payNum}"/>
        <!--<input type="hidden" name="id" th:value="${id}"/>-->
        <div class="row" th:if="${!#strings.isEmpty(yeePay)}">
          <h4><strong>选择银行</strong></h4>
        </div>
        <div class="line" th:if="${!#strings.isEmpty(yeePay)}"></div>
        <table width="100%" th:if="${!#strings.isEmpty(yeePay)}">
          <tr align="center">
            <td>
              <input type="radio" name="frpId" value="ICBC-NET-B2C" checked="checked"/>
              <img th:src="@{/pc/images/payment/banklogo/acbc.gif}" align="middle" title="工商银行" class="img_box"/>
            </td>
            <td>
              <input type="radio" name="frpId" value="BOC-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/bc.gif}" align="middle" title="中国银行" class="img_box"/>
            </td>
            <td>
              <input type="radio" name="frpId" value="ABC-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/abc.gif}" align="middle" title="农业银行" class="img_box"/>
            </td>
            <td>
              <input type="radio" name="frpId" value="POST-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/youzheng.gif}" align="middle" title="中国邮政" class="img_box"/>
            </td>
          </tr>
        </table>
        <table width="100%" style="margin-top: 15px" th:if="${!#strings.isEmpty(yeePay)}">
          <tr align="center">
            <td>
              <input type="radio" name="frpId" value="PINGANBANK-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/pingan.gif}" align="middle" title="平安银行" class="img_box"/>
            </td>
            <td>
              <input type="radio" name="frpId" value="CCB-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/cbc.gif}" align="middle" title="建设银行" class="img_box"/>
            </td>
            <td>
              <input type="radio" name="frpId" value="CEB-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/guangda.gif}" align="middle" title="光大银行" class="img_box"/>
            </td>
            <td>
              <input type="radio" name="frpId" value="CMBCHINA-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/cmbc.gif}" align="middle" title="招商银行" class="img_box"/>
            </td>
          </tr>
        </table>
        <table width="100%" style="margin-top: 15px" th:if="${!#strings.isEmpty(yeePay)}">
          <tr align="center">
            <td>
              <input type="radio" name="frpId" value="CMBC-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/cmsb.gif}" align="middle" title="民生银行" class="img_box"/>
            </td>
            <td>
              <input type="radio" name="frpId" value="BCCB-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/beijing.gif}" align="middle" title="北京银行" class="img_box"/>
            </td>
            <td>
              <input type="radio" name="frpId" value="ECITIC-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/zhongxin.gif}" align="middle" title="中信银行" class="img_box"/>
            </td>
            <td>
              <input type="radio" name="frpId" value="CIB-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/xingye.gif}" align="middle" title="兴业银行" class="img_box"/>
            </td>
          </tr>
        </table>
        <table width="100%" style="margin-top: 15px" th:if="${!#strings.isEmpty(yeePay)}">
          <tr align="center">
            <td>
              <input type="radio" name="frpId" value="SDB-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/shenfa.gif}" align="middle" title="深圳发展银行" class="img_box"/>
            </td>
            <td>
              <input type="radio" name="frpId" value="BOCO-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/jiaotong.gif}" align="middle" title="交通银行" class="img_box"/>
            </td>
            <td>
              <input type="radio" name="frpId" value="SHB-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/shanghaibank.gif}" align="middle" title="上海银行"
                   class="img_box"/>
            </td>
            <td>
              <input type="radio" name="frpId" value="GDB-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/guangfa.gif}" align="middle" title="广发银行" class="img_box"/>
            </td>
          </tr>
        </table>
        <table width="100%" style="margin-top: 15px" th:if="${!#strings.isEmpty(yeePay)}">
          <tr align="center">
            <td>
              <input type="radio" name="frpId" value="SPDB-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/shangpufa.gif}" align="middle" title="上海浦东发展银行"
                   class="img_box"/>
            </td>
            <td>
              <input type="radio" name="frpId" value="BJRCB-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/nongcunshangye.gif}" align="middle" title="北京农村商业银行"
                   class="img_box"/>
            </td>
            <td>
              <input type="radio" name="frpId" value="HXB-NET-B2C"/>
              <img th:src="@{/pc/images/payment/banklogo/huaxia.gif}" align="middle" title="华夏银行" class="img_box"/>
            </td>
            <td>
              <input type="radio" name="frpId" value="1000000-NET"/>
              <img th:src="@{/pc/images/payment/banklogo/hykj.jpg}" align="middle" title="易宝支付" class="img_box"/>
            </td>
          </tr>
        </table>
        <table width="100%" class="payment-hdfk" th:if="${!#strings.isEmpty(HDF)}">
          <div class="row" style="margin-top: 15px">
            <h4><strong>货到付款</strong></h4>
          </div>
          <div class="line"></div>
          <tr align="center">
            <td>
              <div style="margin-left: 30px">
                <input type="radio" name="frpId" value="SJ_HDFK" style="float: left;margin: 8px 4px 0px 0px"/>
                <div class="payment-cod">
                  <span>货到付款</span>
                </div>
              </div>
            </td>
          </tr>
        </table>
      </form>
    </div>
    <div style="border:3px solid #ffe9e9;margin-bottom: 15px;">
      <form action="" id="" method="get" style="margin: 15px">
        <input type="hidden" name="payNumber" th:value="${payNum}"/>
        <div class="row">
          <h4><strong>其他支付</strong></h4>
        </div>
        <div class="line"></div>
        <ul class="other_pay">
          <li th:if="${WeChat} != null"><a th:href="'/api/allinPay/pay?payNumber='+${payNum}+'&payType=W01'">
            <img th:src="@{/pc/images/payment/banklogo/wechat.png}" align="middle" title="微信支付" />
          </a></li>
          <li th:if="${AliPay} != null"><a th:href="'/api/allinPay/pay?payNumber='+${payNum}+'&payType=A01'">
            <img th:src="@{/pc/images/payment/banklogo/alipay.png}" align="middle" title="支付宝" /></a></li>
        </ul>
      </form>
    </div>
    <div class="clearfix" style="padding-top: 10px;padding-bottom: 30px">
      <div>
        <span style="color:#808080">订单总价为：</span><strong style="color:#ff3b3c" th:text="${amount} + '元'">
        &#45;&#45;</strong>
      </div>
      <div class="row">
        <div class="submit_order">确认付款</div>
      </div>
    </div>
    <div style="clear: both;"></div>
  </div>
  <div th:include="payment/introduce/page :: footer"></div>
</div>
</body>

</html>